import { Button, message } from 'antd';

import type { FC } from 'react';

import profit1 from '@/assets/images/profitReturn1.png';
import profit2 from '@/assets/images/profitReturn2.png';
import BaseDiv from '@/components/baseDiv';

import styles from './index.less';

import TextView from '../text';

const ProfitReturn: FC = () => {
  const baseStyles: React.CSSProperties = {
    height: 688,
    backgroundColor: '#F8F9FC',
  };
  const dataArr: string[] = [
    '推动精益化生产，提升现场管理水平',
    '建立快速化、透明化、自上而下的异常监管机制',
    '建立生产现场异常状况的处理机制',
  ];
  const dataArr1: string[] = [
    '优化生产现场异常信息的反馈流程',
    '存储异常处理过程的完整信息',
    '有效考核支援部门人员的能力及工作态度，打造团队执行力',
  ];
  return (
    <BaseDiv
      baseStyles={baseStyles}
      boxStyles={{ display: 'flex', alignItems: 'center', flexDirection: 'column' }}
    >
      <div className={styles.titleContent}>收益与回报</div>
      <div className={styles.imgContent}>
        <img src={profit1} />
        <img src={profit2} />
      </div>
      <div className={styles.textContent}>
        <div style={{ height: '100%', width: 398 }}>
          <TextView title=" " dataSource={dataArr} />
        </div>
        <div style={{ width: 398, height: '100%' }}>
          <TextView title=" " dataSource={dataArr1} />
        </div>
      </div>
      <div className={styles.buttonContent}>
        <Button type="primary" onClick={() => { message.info('暂无此功能');}}>立即体验</Button>
      </div>
    </BaseDiv>
  );
};

export default ProfitReturn;
